<template>
  <div>
    <van-card
      v-for="(item, index) in shopList"
      :key="item.id"
      :num="item.count"
      :price="item.price.toFixed(2)"
      desc="描述信息"
      :title="item.title"
      :thumb="item.img"
    >
      <template #footer>
        <!-- 时间修饰符 -->
        <van-button
          @click.stop="delCarItem(item, index)"
          type="info"
          size="mini"
          >－</van-button
        >
        <van-button @click.stop="addCarItem({ index })" type="info" size="mini"
          >＋</van-button
        >
      </template>
    </van-card>

    <van-submit-bar
      disabled
      :price="3050"
      button-text="提交订单"
      tip="你的收货地址不支持同城送, 我们已为你推荐快递"
      tip-icon="info-o"
    />
  </div>
</template>

<script>
import { mapState, mapMutations,mapGetters } from "vuex";
export default {
  computed: {
    ...mapState({
      shopList: (state) => state.Car.shopList,
    }),
    ...mapGetters({
      allPrice:'Car/allPrice'
    })
  },
  methods: {
    // 商品减少
    delCarItem(item, index) {
      if (item.count <= 1) {
        this.$dialog
          .confirm({
            title: "商品删除",
            message: "您确定要删除" + item.title + "吗？",
          })
          .then(() => {
            this.remCarItem({ index, rem: true });
            this.$toast.success("删除成功");
          })
          .catch(() => {
            this.$toast("取消删除");
          });
      } else {
        this.remCarItem({ index, rem: false });
      }
    },
    ...mapMutations({
      addCarItem: "Car/addCarItem",
      remCarItem: "Car/remCarItem",
    }),
  },
};
</script>

<style>
</style>